import React, { Component } from 'react';
import {View,Text,ScrollView} from 'react-native';

import {List,TextField} from 'iftide';

export default class Basic extends Component{
    constructor(props) {
        super(props);
        this.state = {
            comboBoxData : [
                {value: '01', text: '853'},
                {value: '02', text: '854'},
                {value: '03', text: '855'},
                {value: '04', text: '856'},
                {value: '05', text: '857'},
                {value: '06', text: '858'},
            ],
            defaultValue : '03',
            leftText:'取消',
            rightText:'确认'
        }
    }
    onButtonClickFunc(text){
        console.log(text);
    }

    changeFunc(text,value){
        console.log(text);
        console.log(value);
    }

    okFunc(text,value){
        console.log(text);
        console.log(value);
    }
    deleteEvent(rowData,sectionId,rowID){
        console.log(rowData,sectionId,rowID)
    }
    otherEvent(rowData,sectionId,rowID){
        console.log(rowData,sectionId,rowID)
    }
    onPress(current,index){
        console.log(current,index)
    }

    render(){
        let title='这是左侧title';
        let titleChild=<Text>这是titleChilds</Text>
        let subTitle='这是左侧subTitle';
        let subTitleChild=<Text>subTitleChild</Text>
        let status=<Text>这是右侧status</Text>;
        let description=<Text style={{color:'#989899'}}>这是右侧description</Text>;
        let leftComponent=<View style={{height:'100%',paddingTop:6}}><Text style={{backgroundColor:"#FFE0E0",paddingLeft:3,paddingRight:3,color:'#FF5A5B',marginRight:10}}>申购</Text></View>;

        let dataPickerStyles={width:90,backgroundColor:'transparent',height:30,margin:0}
      

        let data=[
            {
                hasLeftImg:false,
                // title : title,
                // titleStyle:{'color':'red'},
                // subTitle:subTitle,
                // subTitleStyle:{'color':'red'},
                status:status,
                description:description,
                hasArrow:true,
                deleteText:'删除',
                deleteBgColor:'#ff7b7b',
                hasHiddenBtn:false,
                disabled:0,
                containerStyle:{borderBottomWidth:0,borderColor:'red'},
                leftComponent:leftComponent,
                titleChild:titleChild,
                subTitleChild:subTitleChild
            },
            {
                hasLeftImg:false,
                leftImg:require('./icon.png'),
                subTitle : subTitle,
                description:description,
                hasArrow:false,
                hasHiddenBtn:true,
                deleteText:'删除',
                deleteBgColor:'#ff7b7b',
                disabled:"0"
            },
            {
                hasLeftImg:false,
                title : '转让产品推荐',
                description:<Text style={{fontSize:12,fontWeight:'bold',color:'blue'}} onPress={()=>{alert("ok")}}>查看更多</Text>,
                hasArrow:false,
                hasHiddenBtn:false,
            },

            {
                hasLeftImg:true,
                leftImg:require('./icon.png'),
                title : title,
                description:description,
                hasArrow:true,
                deleteText:'删除',
                deleteBgColor:'green',
                hasHiddenBtn:true,
            },
            {
                hasLeftImg:true,
                leftImg:require('./icon.png'),
                title : '这是左侧title这是左侧title这是左侧title这是左侧title',
                hasArrow:true,
                hasHiddenBtn:true,
                deleteText:'删除',
                deleteBgColor:'blue',
            },
            {
                hasLeftImg:true,
                leftImg:require('./icon.png'),
                title : title,
                subTitle : subTitle,
                description:description,
                hasArrow:true,
                hasHiddenBtn:true,
                deleteText:'删除',
                deleteBgColor:'pink',
                otherHiddenBtnText:'修改别名',
                otherHiddenBtnBg:'green',
            }
        ]

        let deleteListView={
            dataSource:data,
            deleteEvent:this.deleteEvent,
            otherEvent:this.otherEvent,
            onPress: this.onPress
        };

        let phonenum='手机号码';
        let rightArea=(
            <View style={{flexDirection:'row'}}>
                <View style={{width:60,alignItems:'center',justifyContent:'center'}}>
                    <Text>手机号码</Text>
                </View>
                <View style={{flexDirection: 'row',flex:1,alignItems:'center'}}>
                    <TextField
                        hasTopBorder={false}
                        placeholder="请输入电话号码"
                        showClearIcon={true}
                        textInputStyle={[{fontSize:16}]}
                        />
                </View>
            </View>);
        let dataSource=[{
            title : phonenum,
            status: rightArea,
        }];

        return(
            <View style={{marginTop:30,flex:1}}>
                <ScrollView>
                    <List {...deleteListView}></List>
                    <View style={{marginTop:15,borderTopWidth:1,borderBottomWidth:1,borderColor:'#d8d8d8'}}>
                        {rightArea}
                    </View>
                </ScrollView>
            </View>
        );
    }
}


